<!DOCTYPE html>
<html>
	<head>
		<meta name="description" content="Convert cyworld's swf photo to image files.">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<title>Cyworld swf2image</title>
		<link rel="stylesheet" href="/static/boxy.css" type="text/css">
	</head>
	<body>
		<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
		<script type="text/javascript" src="/static/jquery.boxy.js"></script>
		<script type="text/javascript">
			$(function() {
				$("#form").submit(function() {
					var form = this;
					var url = $("#url").val();
					console.log(url)
					if(!url.match(/\.swf$/)) {
						var box = new Boxy("<em>Discovering swf file in given url...</em>", {modal: true, closeable: false});
						$.ajax({
						  url: '/discover',
						  dataType: 'json',
						  data: {url: url},
						  success: function(data) {
							if(data.swfUrl) {
								$("#url").val(data.swfUrl)
								convert(form);
								box.hideAndUnload();
							}
						  },
						  error: function() {
							box.hideAndUnload();
							new Boxy("<p>swf has not found on this url :(</p>", {title: 'Error', modal: true, closeable: true});
						  }
						});
					} else {
						convert(form);
					}
					return false;
				});
				var convert = function(form) {
					var box = new Boxy("<em>This may takes couple of minutes.</em>", {title: "Converting...", modal: true, closeable: false});
					$.ajax({
					  url: form.action + "?callback=?",
					  dataType: 'jsonp',
					  data: $(form).serializeArray(),
					  success: function(data) {
						$.each(data, function() {
							var uri = 'data:' + this.type + ';' + this.encoding + ',' + this.data;
							$('<li><a href="' + uri + '" title="Open this image in new window."><img src="' + uri + '"></a></li>').appendTo("#result");
						});
						$("#result a").prop("target", "_blank");
						box.hideAndUnload();
					  },
					  error: function() {
						box.hideAndUnload();
						new Boxy("<p>Something went wrong :o</p>", {title: 'Error', modal: true, closeable: true});
					  }
					});
				}
			});
		</script>
		<h1>cyworld swf2image</h1>
		<div id="info"><label for="url">Please enter swf url of cyworld</label></div>
		<form action="/" method="post" id="form">
			<input type="url" name="url" id="url" size="64" required>
			<input type="submit">
		</form>
		<ul id="result"></ul>
		<img src="http://code.google.com/appengine/images/appengine-noborder-120x30.gif" alt="Powered by Google App Engine" />
		<script type="text/javascript"><!--
		google_ad_client = "ca-pub-3191390748008227";
		google_ad_slot = "0094634488";
		google_ad_width = 200;
		google_ad_height = 200;
		//-->
		</script>
		<script type="text/javascript"
		src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
		</script>		
	</body>
</html>